﻿/// <reference path = "Base.ts" />
namespace VantCellTypes {

    interface PaginationCellTypeParam {
        PageChangeCommand: Forguncy.Plugin.ICustomCommandObject;
        ListviewName: string;
        mode: string;
        itemsPerPage: number;
        showPageSize: number;
        prevText: string;
        nextText: string;
        forceEllipsis: boolean;
        hideOnOnePage: boolean;
    }

    export class PaginationCellType extends VantCellTypeBase<PaginationCellTypeParam> {
        _listview: Forguncy.ListView;
        _pagingChangedCallBack: Function;

        public createContent() {
            const cellType = this.cellType;
            if (cellType.ListviewName) {
                Forguncy.ForguncyData.initListviewPaginationInfo(this.runTimePageName, cellType.ListviewName, cellType.itemsPerPage);
            }

            return super.createContent();
        }

        public onPageLoaded(info: Forguncy.Plugin.CellTypeInfo) {
            const self = this;
            const cellType = this.cellType;
            if (cellType.ListviewName) {
                this._listview = Forguncy.Page.getListViews(true)
                    .filter(i => i.getName() === cellType.ListviewName && i.getRunTimePageName() === this.runTimePageName)[0];
            }
            const listview = this._listview;
            const option = {
                el: "#" + this.uId,
                template: `
<van-pagination
    v-show="show"
    ref="van-pagination"
    v-model="pageNumber"
    :mode="mode"
    :total-items="totalItems"
    :items-per-page="itemsPerPage"
    :show-page-size="showPageSize"
    :prev-text="prevText"
    :next-text="nextText"
    :force-ellipses="forceEllipsis"
    @change="pageChange"
></van-pagination>
`,
                data() {
                    return {
                        ...self.getDefaultData(cellType),
                        ...cellType
                    };
                },
                computed: {
                    show({ totalItems, itemsPerPage }) {
                        if (cellType.hideOnOnePage && itemsPerPage > 0) {
                            return totalItems / itemsPerPage > 1;
                        }
                        return true;
                    }
                },
                methods: {
                    setValue(value) {
                        let pageIndex = Math.max(1, Number(value));
                        if (Number.isNaN(pageIndex)) {
                            pageIndex = 1;
                        }
                        if (pageIndex !== this.pageNumber) {
                            this.pageNumber = pageIndex;
                        }
                    },
                    getValue() {
                        return this.pageNumber;
                    },
                    pageChange() {
                        if (cellType.PageChangeCommand?.Commands?.length) {
                            const initValue = {};
                            initValue[cellType.PageChangeCommand.ParamProperties["pageNumber"]] = this.pageNumber;
                            initValue[cellType.PageChangeCommand.ParamProperties["totalItems"]] = this.totalItems;
                            initValue[cellType.PageChangeCommand.ParamProperties["itemsPerPage"]] = this.itemsPerPage;
                            self.executeCustomCommandObject(cellType.PageChangeCommand, initValue);
                        }
                        self.commitValue();
                    },
                    setItemsPerPage(itemsPerPage: number) {
                        this.itemsPerPage = itemsPerPage;
                        if (listview) {
                            listview.usePaginationDisplay(itemsPerPage);
                        }
                    },
                    setCurrentPage(pageNumber: number) {
                        if (listview) {
                            listview.usePaginationDisplay(this.itemsPerPage, pageNumber);
                        }
                    },
                    setTotalItems(totalItems: number) {
                        this.totalItems = totalItems;
                    }
                },
                watch: {
                    pageNumber(pageNumber: number) {
                        this.setCurrentPage(pageNumber);
                    }
                }
            };

            this.createVueApp(option);
            this.commitValue();
            if (listview) {
                this._pagingChangedCallBack = (data: any, info: Forguncy.PageingInfoChangedEventArg) => {
                    this.vue.totalItems = info.TotalRowCount;
                    this.vue.pageNumber = info.CurrentPageIndex;
                    this.vue.itemsPerPage = info.MaxRowCountOfOnePage;
                };
                listview.bind(Forguncy.ListViewEvents.PageingInfoChanged, this._pagingChangedCallBack);
            }

            super.onPageLoaded(info);
        }

        destroy() {
            super.destroy();
            if (this._listview) {
                this._listview.unbind(Forguncy.ListViewEvents.PageingInfoChanged, this._pagingChangedCallBack);
            }
        }

        private getDefaultData(cellType: PaginationCellTypeParam) {
            return {
                pageNumber: 1,
                totalItems: undefined,
                prevText: undefined,
                nextText: undefined,
                forceEllipsis: !!cellType.forceEllipsis
            };
        }

        // runtime methods
        public SetItemsPerPage(itemsPerPage: number) {
            const value = Number(itemsPerPage);
            this.vue.setItemsPerPage(value);
        }

        public SetCurrentPage(pageNumber: number) {
            const value = Number(pageNumber);
            this.vue.setValue(value);
        }

        public SetTotal(totalItems: number) {
            this.vue.setTotalItems(totalItems);
        }

        public ExecuteCommand() {
            this.vue.pageChange();
        }
    }
}

Forguncy.Plugin.CellTypeHelper.registerCellType("Vant.CellTypes.Pagination, Vant", VantCellTypes.PaginationCellType);